import "../css/joinActivity.scss"
import '../css/common/header.scss'
import '../css/common/footer.scss'
import "../assets/js/jquery.min.js"
import "../assets/js/jquery.qqFace.js"
import "../assets/js/jquery.ajaxfileupload.js"



if (module.hot) { module.hot.accept() } // 实现热更新

setTimeout(()=>{
    console.log('specialTopic');
}, 1000);



(function () {
    $('.nav ul li a').removeClass('active');
    $('.nav ul li a').eq(6).addClass('active');

    var $gift = $('.aside .hot-game dd');

    $gift.hover(function () {
        $(this).siblings().removeClass('hover');
        $(this).addClass('hover');
    });

    $('.switchBtn').click(function(){
        $('.switchBtn').toggleClass('active');
        $('.article-box').toggle();
        $('.comment').toggle();
    })

    $('.joinBtn a').click(function(){
        $('.switchBtn').removeClass('active');
        $('.reply-show').addClass('active');
        $('.article-box').hide();
        $('.comment').show();
        $("html,body").animate({ scrollTop: $(".top-bar").offset().top - 20}, 1000);
    })

    $('#input-content').keyup(function(){
        if($(this).val().length > 300) {
            alert("您输入的字数已超出！");
            $(this).val($(this).val().substr(0, 300));
        }
    })

    $('.pubComment').click(function(){
        var text = $('#input-content').val();
        var imgSrc = $('.upload-img img');
        console.log(text,imgSrc);
    })

    $('.item').mouseover(function(){
        $(this).find('img').css('transform','scale(1.2)');
        $('.item').mouseout(function(){
            $(this).find('img').css('transform','scale(1)');
        })
    })

    $('.onPhone').mouseover(function(){
        console.log(1)
        $('.code').show();
        $('.onPhone').mouseout(function(){
            $('.code').hide();
        })
    })

    $('.comment-list .more').click(function(){
        $('.comment-list ul').show();
        var prevLength = $('.comment-list li').length;

        //ajax
        var finalLength = $('.comment-list li').length;

        if(prevLength == finalLength){
            $(this).html('已到尾部');
        }
    })

    $('.replyBtn').click(function(){
        $('.reply-box').toggle();
    })

    var initialSupport = parseInt($('.supportBtn em').html());
    $('.supportBtn').click(function(){
        var afterClick = parseInt($('.supportBtn em').html());
        if(initialSupport != afterClick) {
            alert('已经支持过了！！！');
        }else {
            $('.supportBtn em').html(' '+ ++afterClick + ' ');
        }
    })
})();



$(function(){
    //表情
    $('.face-show').qqFace({
        id : 'face-box',
        assign:'input-content',
        path:'../assets/img/arclist/'	//表情存放的路径
    });

    function replace_em(str){

        str = str.replace(/\</g,'&lt;');

        str = str.replace(/\>/g,'&gt;');

        str = str.replace(/\n/g,'<br/>');

        str = str.replace(/\[em_([0-9]*)\]/g,'<img src="../assets/img/arclist/$1.gif" border="0" />');

        return str;

    }

    $(".upload-img input").on('change',function(){
            var file = this.files[0],
                max_upload = 300*1024, //最大允许上传尺寸
                file_size = file.size,
                len = $(".upload-img img").length, //上传图片数量
                max = 4,
                directUpSize = 100*1024; //临界尺寸，大于则压缩


            if(file_size>max_upload){
                alert("图片必须小于300kb！");
                return;
            }
            if(len<max){
                if( file_size <= directUpSize){
                //    todo ajax
                }
                // else{} 下面的
                var reader = new FileReader();
                reader.onload = function () {
                    var result = this.result; //base64字符串
                    var img = new Image();
                    img.src = result; //加载为图片
                    if (img.complete) {
                        callback();
                    } else {
                        img.onload = callback;
                    }
                    function callback() {
                        var base64data = compress(img); //压缩获得压缩后的base64字符串
                        console.log(base64data);
                        // $.post("url",{'base64':base64data,'type':'base64'},function(data){
                        //     renderImg(data);
                        // },'json');
                        renderImg(base64data);
                    }
                };
                reader.readAsDataURL(file);
            }else{
                alert("最多只能传"+max+"张图片");
            }
        });


    //压缩图片
    function compress(img) {
        var canvas = document.createElement("canvas");
        var ctx = canvas.getContext('2d');
        var tCanvas = document.createElement("canvas");
        var tctx = tCanvas.getContext("2d");

        // var initSize = img.src.length;
        var width = img.width;
        var height = img.height;
        //如果图片大于四百万像素，计算压缩比并将大小压至400万以下
        var ratio;
        if ((ratio = width * height / 2000000)>1) {
            ratio = Math.sqrt(ratio);
            width /= ratio;
            height /= ratio;
        }else {
            ratio = 1;
        }
        canvas.width = width;
        canvas.height = height;
//        铺底色
        ctx.fillStyle = "#fff";
        ctx.fillRect(0, 0, canvas.width, canvas.height);
        //如果图片像素大于100万则使用瓦片绘制
        var count;
        if ((count = width * height / 1000000) > 1) {
            count = ~~(Math.sqrt(count)+1); //计算要分成多少块瓦片
//            计算每块瓦片的宽和高
            var nw = ~~(width / count);
            var nh = ~~(height / count);
            tCanvas.width = nw;
            tCanvas.height = nh;
            for (var i = 0; i < count; i++) {
                for (var j = 0; j < count; j++) {
                    tctx.drawImage(img, i * nw * ratio, j * nh * ratio, nw * ratio, nh * ratio, 0, 0, nw, nh);
                    ctx.drawImage(tCanvas, i * nw, j * nh, nw, nh);
                }
            }
        } else {
            ctx.drawImage(img, 0, 0, width, height);
        }
        //进行最小压缩
        var ndata = canvas.toDataURL('image/jpeg', 0.5);
        //console.log('压缩前：' + initSize);
        //console.log('压缩后：' + ndata.length);
        //console.log('压缩率：' + ~~(100 * (initSize - ndata.length) / initSize) + "%");
        tCanvas.width = tCanvas.height = canvas.width = canvas.height = 0;
        return ndata;
    }


    //渲染预览
    function renderImg(data){
        if(data){
            var img_obj="<li class='img-show'><img src='"+ data +"' alt=''><span class='removeBtn'></span></li>";
            // console.log(img_obj);
            $("#file_upload"). closest('li').before(img_obj);
        }else{
            alert("错误路径！");
        }
    }

    function ajaxFileUpload(url) {
        $.ajaxFileUpload(
            {
                url: url, //用于文件上传的服务器端请求地址
                secureuri: false, //是否需要安全协议，一般设置为false
                fileElementId: 'file_upload', //文件上传域的ID
                dataType: 'json', //返回值类型 一般设置为json
                success: function (data, status)  //服务器成功响应处理函数
                {
                    renderImg(data);
                },
                error: function (data, status, e)//服务器响应失败处理函数
                {
                    alert('上传失败，请重试！');
                    console.log(data)
                }
            }
        )
        renderImg($('.upload-img input').files[0])
        return;
    }

    $(".upload-img .removeBtn").live('click',function(){
        $(this).closest('li').remove();
        // todo 删除图片的ajax
    });
});



//
// //基本配置
// var configParmas={"gid":"388","tid":10,"area_type":2,"ulogo":11,"hf_limit":0,"css_key":0,"pageSize":10,"table":"game"};
// configParmas.uid='0';
// configParmas.username='琵琶网湖北省玩家';
// var cookieName='9b5563584100bef6c946ea5cabb1f56b';
//
//
//
//
// var list_url = '/ajax/comment/list';
// var add_url = '/ajax/comment/add';
// var ding_url = '/ajax/comment/ding';
//
// function getDate(time) {
//     var date = new Date();
//     date.setTime(date.getTime() + (time * 1000));
//     return date
// }
// function is_action(type, id) {
//     if (type == 1) {
//         var name = cookieName;
//         var a = $.cookie(name);
//         if (a) {
//             doLog('评论太积极，请过一会再试！！！');
//             return 0
//         }
//         var expires = getDate(10);
//         $.cookie(name, type, {
//             path: '/',
//             expires: expires
//         });
//         return 1
//     } else if (type == 2) {
//         var name = cookieName + "_1" + id;
//         var a = $.cookie(name);
//         if (a) {
//             doLog('已经支持过了！！！');
//             return 0
//         }
//         $.cookie(name, type, {
//             path: '/',
//             expires: 100
//         });
//         return 1
//     }
//     return 0
// }
// function get_list() {
//     var endHtml = "已到尾部";
//     var page = $("#ajaxgetmorepinglun").attr('rel');
//     if (page != 'end') {
//         var parmas = configParmas;
//         parmas.page = page;
//         $.post(list_url, parmas, function(data) {
//             if (!data.html || data.page == 'end') {
//                 $("#ajaxgetmorepinglun").html(endHtml)
//             }
//             if (data.html) {
//                 $("#comment_list").append(data.html)
//             }
//             $("#ajaxgetmorepinglun").attr('rel', data.page)
//         }, 'json')
//     }
// }
// get_list();
//
// var sensitiveWords = ['充值','优惠','返利']
// function contentFiller(content) {
//     if (content == '') {
//         return '评论内容不能为空 !!!'
//     }
//     if (content) {
//         var msg = '';
//         $.each (sensitiveWords, function(i,v) {
//             if (content.indexOf(v) > -1 ) {
//                 msg =  "内容含敏感词，有问题请联系客服QQ：2885339244";
//                 return false;
//             }
//         })
//         if (msg != '') {
//             return msg;
//         }
//     }
//     return false
// }
// function doLog(msg) {
//     alert(msg)
// }
//
// // function zhankai(p5) {
// // 	$(p5).find(".hide").attr("class", '');
// // 	$(p5).find(".zhankaibutton").remove()
// // }
//
// function hideAllHuifu() {
//     $("#comment_list").find('.p4').hide()
// }
// function addCount() {
//     var n = $("#_totalpl").text();
//     n = n * 1 + 1;
//     $("#_totalpl").text(n)
//     $("._totalpl_class").text(n);
// }
// $(function() {
//     var n=$("#_totalpl").text();
//     $("._totalpl_class").text(n);
//
//
//
//
//
//     $("#ajaxgetmorepinglun").click(function() {
//         get_list()
//     });
//     $(".huifu").live('click', function() {
//         var li = $(this).closest('li');
//         var ul = $(this).closest('ul');
//         var p3 = $(li).find('.p3');
//         var p4 = $(li).find('.p4');
//         hideAllHuifu();
//         $(p4).show()
//     });
//     $(".huifubutton").live('click', function() {
//         var obj = $(this);
//         var pid = $(obj).attr('rel');
//         var textarea = $(obj).closest('p').find('textarea');
//         var content = $(textarea).val();
//         var msg = contentFiller(content);
//         if (msg) {
//             doLog(msg);
//             return false
//         }
//         if (!is_action(1, 0)) return false;
//         var parmas = configParmas;
//         parmas.content = content;
//         parmas.pid = pid;
//         parmas.iszh = 0;
//
//         $.post(add_url, parmas, function(data) {
//             if (data.error) {
//                 doLog(data.msg);
//                 return false
//             }
//
//             var dt=$(obj).closest('li').find('dt');
//             var zhflist=$(obj).closest('li').find('.zhflist');
//
//             $(zhflist).prepend(data.html);
//             $(dt).show();
//             $(textarea).val('');
//             hideAllHuifu();
//         }, 'json')
//     });
//     $(".fabiaobutton").live('click', function() {
//         var obj = $(this);
//         var pid = $(obj).attr('rel');
//         var textarea = $("#fabiao_content");
//         var content = $(textarea).val();
//         var msg = contentFiller(content);
//         if (msg) {
//             doLog(msg);
//             return false
//         }
//         if (!is_action(1, 0)) return false;
//         var parmas = configParmas;
//         parmas.content = content;
//         parmas.pid = pid;
//         parmas.iszh = 1;
//
//         if(pid==0){
//             var img_obj={};
//             var img_input_obj=$(".add-pic-list img");
//             if(img_input_obj){
//                 $.each(img_input_obj,function(n,m){
//                     img_obj[n]=$(m).attr('src');
//                 })
//                 parmas.img_obj=img_obj;
//             }
//         }
//
//
//         $.post(add_url, parmas, function(data) {
//             if (data.error) {
//                 doLog(data.msg);
//                 return false
//             }
//
//             if(pid==0){
//                 $(".add-pic-list .img_file_li").remove();
//             }
//
//             $("#comment_list").prepend(data.html);
//             $(textarea).val('');
//             addCount()
//         }, 'json')
//     });
//
// // 	$(".zhankaibutton").live("click", function() {
// // 		var p5 = $(this).closest('.p5');
// // 		zhankai(p5)
// // 	});
//
//     $(".p_dingup").live("click", function() {
//         var rel = $(this).attr('rel');
//         if (!is_action(2, rel)) return false;
//         var parmas = configParmas;
//         parmas.id = rel;
//         $.post(ding_url, parmas);
//         var i = $(this).find('em');
//         var n = $(i).text();
//         n = n * 1 + 1;
//         $(i).text(n)
//     });
//
//     $(".open_list").live("click",function(){
//         var rel=$(this).attr('rel');
//         if(!rel){
//             $(this).closest('dt').find(".zhflist .meli").show();
//             var h0=$(this).html();
//             $(this).attr('rel',h0);
//             $(this).html('收起评论');
//         }else{
//             $(this).closest('dt').find(".zhflist .meli").hide();
//             $(this).html(rel);
//             $(this).attr('rel','');
//         }
//
//
//
//     });
// });
//
// $(function(){
//     $(".emotion").qqFace({
//         id : 'facebox',
//         assign:'fabiao_content',
//         path:'/static/pc/img/comment/arclist/'
//     });
// })
